var vm = new Vue({
	el: '#app',
	data: function() {
		return {
			a: [], //数组
			n: 3, //阶数
			i: 0, //空格的纵坐标
			j: 0, //空格的横坐标
			t: 0, //游戏时间
			s: false, //游戏状态
			f: '', //计时器
			n0: 3, //计数器
			paiHangBang: []
		};
	},
	methods: {
		dianJi: function(i, j) {
			if(!this.s) {
				return;
			}
			if(Math.abs(i - this.i) + Math.abs(j - this.j) == 1) {
				this.jiaoHuan(i, j);
			}
		},
		anJian: function(i, j) {
			if(!this.s) {
				return;
			}
			if(0 <= this.i - i && this.i - i < this.n && 0 <= this.j - j && this.j - j < this.n) {
				this.jiaoHuan(this.i - i, this.j - j);
			}
		},
		jiaoHuan: function(i, j) {
			this.a[this.i][this.j] = this.a[i][j];
			this.a[i][j] = this.n * this.n;
			this.i = i;
			this.j = j;
			this.a = this.a.slice();
			if(this.wanCheng()) {
				this.jieShu();
				if(!this.paiHangBang[this.n]) {
					this.paiHangBang[this.n] = [];
				}
				this.paiHangBang[this.n].push({
					xm: sessionStorage.getItem('yongHuMing'),
					cj: this.t
				});
				this.paiHangBang[this.n].sort(function(a, b) {
					return a.cj <= b.cj ? -1 : 1;
				});
				this.paiHangBang[this.n] = this.paiHangBang[this.n].slice(0, 5);
				localStorage.setItem('paiHangBang', JSON.stringify(this.paiHangBang));
				this.$alert('成绩：' + this.t + '秒！', '成功！', {
					confirmButtonText: '确定',
					type: 'success',
					center: true
				});
			}
		},
		kaiShi: function(n) {
			this.n = this.n0;
			var a0 = this.luanXuShuZu(n * n - 1);
			a0[n * n - 1] = this.n * this.n;
			if(this.niXuShu(a0) % 2 == 1) {
				var t;
				t = a0[0];
				a0[0] = a0[1];
				a0[1] = t;
			}
			this.a = [];
			for(var i = 0; i < n; i++) {
				this.a[i] = [];
				for(var j = 0; j < n; j++) {
					this.a[i][j] = a0[i * n + j];
				}
			}
			this.i = n - 1;
			this.j = n - 1;
			this.t = 0;
			this.s = true;
			window.clearInterval(this.f);
			_this = this;
			this.f = window.setInterval(function() {
				_this.t++;
			}, 1000);
		},
		jieShu: function() {
			this.s = false;
			window.clearInterval(this.f);
		},
		luanXuShuZu: function(n) {
			var a = [];
			for(var i = 0; i < n; i++) {
				a[i] = i + 1;
			}
			a.sort(function() {
				return Math.random() < .5 ? -1 : 1;
			});
			return a;
		},
		niXuShu: function(a) {
			var nxs = 0;
			for(var i = 0; i < a.length - 1; i++) {
				for(var j = i + 1; j < a.length; j++) {
					if(a[i] > a[j]) {
						nxs++;
					}
				}
			}
			return nxs;
		},
		wanCheng: function() {
			for(var i = this.n - 1; i >= 0; i--) {
				for(var j = this.n - 1; j >= 0; j--) {
					if(this.a[i][j] != i * this.n + j + 1) {
						return false;
					}
				}
			}
			return true;
		},
		qingKong: function() {
			localStorage.removeItem('paiHangBang');
			this.paiHangBang = [];
		}
	},
	mounted: function() {
		this.$nextTick(function() {
			var phb = localStorage.getItem('paiHangBang');
			if(phb) {
				this.paiHangBang = JSON.parse(phb);
			} else {
				this.paiHangBang = [];
				localStorage.setItem('paiHangBang', JSON.stringify(this.paiHangBang));
			}
		});
	}
});